<template>
    <div class="container">
        <h3>产销对接</h3>
            <el-row style="margin-top:20px;">
                <el-col :span="7">
                    <el-input placeholder="请输入关键词" v-model="searchName1" style="width:300px;">
                        <i slot="prefix" class="el-input__icon el-icon-search"></i>
                        <el-button slot="append" @click="handleSearch1">搜索</el-button>
                    </el-input>
                </el-col>
                <el-button type="primary" v-if="!added" style="float:right; margin-right: 10px"   @click="handleadded">新增</el-button>
            </el-row>
                
            <el-table
                :data="tableData1"
                border
                style="margin-top:20px;"
                ref="multipleTable"
                header-cell-class-name="table-header"
            >
				<el-table-column prop="img" sortable label="产品图">
					<template slot-scope="scope">
						<img :src="$store.state.plantImg + scope.row.img" alt="" style="width:50px; height:50px;" v-if="scope.row.img != '' || scope.row.img!= null ">
					</template>
				</el-table-column>
                <el-table-column prop="title" sortable label="产品标题"></el-table-column>
                <!-- <el-table-column prop="createTime" sortable label="添加时间"></el-table-column> -->
                <el-table-column prop="relatedProducts" sortable label="关联产品"></el-table-column>
				<el-table-column prop="quality" sortable label="保质期">
					<template slot-scope="scope">
						{{scope.row.quality}}月
					</template>
				</el-table-column>
                <el-table-column label="操作" width="150" align="center">
                    <template slot-scope="scope">
                        <el-button
                            v-if="!edit"
                            type="text"
                            @click="handleEdit(scope.$index, scope.row)"
                        >编辑</el-button>
						<el-button
						    v-if="!check"
						    type="text"
						    @click="handleCheck(scope.$index, scope.row)"
						>查看</el-button>
                        <el-button
                            v-if="!del"
                            type="text"
                            style="color:red;"
                            @click="handleDelete1(scope.$index, scope.row)"
                        >删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination layout="total, prev, pager, next, jumper" :page-size="pagesize" :current-page.sync="currentPage1"  @current-change="handleCurrentChange1" :total="total1" style="margin-top:20px"></el-pagination>
           
        <big-img v-if="showImg" @clickit="viewImg" :imgSrc="imgSrc"></big-img>
    </div>
</template>

<script>
    import BigImg from '../../../common/BigImg.vue';
    import {productDock_findByList,productDock_delete } from '@/request/api'
    export default {
        components: { 'big-img':BigImg},
        beforeRouteLeave(to, form, next) {
        next()
    },
        data() {
            return {
				
                showImg:false,
　　　　　　     imgSrc: '', 
                state:0,
                currentPage1:1,
                pagesize:10,
                total1:0,
                searchName1: '',
                activeName: '中药材',
                tableData1: [],
                boxCode:'',
                boxCode1:'',
                action:'',
                added:true,//新增
                edit:true,//编辑
                del:true,//删除
				check:true,
            };
        },
        created(){
           
   
        },
        mounted(){
           this.getTableList();
           this.judgmentAuthority()
            
        },
        
        methods: {
			// 获取 产品介绍列表数据
			getTableList(){
				let data = {
					page:this.currentPage1,
					query:this.searchName1
				}
				productDock_findByList(data).then((res)=>{
					this.tableData1 = res.rows
					this.total1 = res.total
				})
			},
			
            handlecheck(index,row){
                
                this.showImg = true;
　　　　　　    // 获取当前图片地址
　　　　　　    this.imgSrc = this.$store.state.plantImg + row.basis;
            },
            viewImg(){
                this.showImg = false;
            },
          
 
          //  列表页书跳转
            handleCurrentChange1(val){
                this.currentPage1 = val
                this.getTableList()
            },
      
            handleClick(tab, event) {
              
            },
          
           // 进入新增页面
            handleadded(){
                this.$router.push({
                    path:'/productAndmarket/added',
                })
            },
			// 进入修改页面
            handleEdit(index,row){
				this.$router.push({
				    path:'/productAndmarket/added',
					query:{ id:row.id }
				})
            },
           handleCheck(index,row){
           	this.$router.push({
           	    path:'/productAndmarket/check',
           		query:{ id:row.id }
           	})
           },
            //删除 列表数据
            handleDelete1(index,row){
                this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
					productDock_delete(row.id).then((res)=>{
						 this.$notify({
                            title: '操作成功',
                            message: '删除成功',
                            type: 'success'
                        });
						this.getTableList()
					})    
                });
            },
           

            handleSearch1() {
                this.currentPage1 = 1
                this.getTableList()
            },

            //判定操作按钮显示
            judgmentAuthority() {
                var type = JSON.parse(localStorage.getItem('panduanzhuangtai'));
                type.map((item1) => {
                    if (item1.name == '产品信息' && item1.children != null) {
                        for (var i = 0; i < item1.children.length; i++) {
                            if (item1.children[i].name == '新增') this.added = false;
                            if (item1.children[i].name == '编辑') this.edit = false;
                            if (item1.children[i].name == '删除') this.del = false;
                            if (item1.children[i].name == '查看') this.check = false;
                        }
                    }
                });
            }
        
        }
    }
</script>

<style scoped>
.upload-demo .el-upload--text{
    border: none;
    width: auto;
    height: auto;
    border-radius: 0;
    float: right;
    margin-right: 10px
}
.el-table{ margin-top: 20px;}
.el-pagination{
    text-align: center;
}
/* .el-row{ margin-bottom: 20px;} */
.el-pagination{
    text-align: center;
}
.el-col{
    margin-bottom:0;
}

</style>